@charset "utf-8";
.clearfix::after{
    content: "";
    display: block;
    clear: both;
}
@mixin mi($width,$height,$bg){
    width:$width;
    height: $height;
    background: $bg;
}
@mixin wh($width,$height){
    width:$width;
    height: $height;
}
@mixin size($font,$size,$color){
    font-family: $font;
    font-size: $size;
    color: $color;
}
input:hover{
    animation: dong 1s ease both;
}
input{
    cursor: pointer;
}
//

@-webkit-keyframes dong{
  0%{border-color: red;box-shadow:1px 0px 0px red;color: red;}
  25%{border-color:orange;box-shadow:1px 1px 2px orange;color: orange;}
  50%{border-color:yellow;box-shadow:1px 0px 0px yellow;color: yellow;}
  75%{border-color:green;box-shadow:1px 1px 2px green;color: green;}
  90%{border-color:deepskyblue;box-shadow:1px 0px 0px deepskyblue;color: deepskyblue;}
  100%{border-color:darkviolet;box-shadow:1px 1px 2px darkviolet;color: darkviolet;}     
}

@keyframes zhuang{
    0%{transform: rotateY(0) scale(1);}
    50%{transform: rotateY(90deg) scale(1.2);}
    100%{transform: rotateY(180deg) scale(1);}
}

@keyframes fangfa{
    0%{transform:translateX(0px) scale(1);}
    50%{transform:translateX(-10px) scale(1.2);}
    100%{transform:translateX(0px) scale(1);}
}


@-webkit-keyframes xie{
  0% {transform: translateX(0) translateZ(0) rotateY(0);
    transform-origin: center right; }
  50% {transform: translateX(-40px) translateZ(130px) rotateY(90deg);
    transform-origin: center right; }
    100% {transform: translateX(0px) translateZ(0px) rotateY(0deg);
    transform-origin: center right; }
}


@-webkit-keyframes text1{
  0% {
            transform: translateY(0);
            transform-origin: 50% 50%;
            text-shadow: none;}
  100% {transform: translateY(-5px);
        transform-origin: 50% 50%;
        text-shadow: 0 1px 0 #cccccc, 0 2px 0 #cccccc, 0 3px 0 #cccccc, 0 4px 0 #cccccc, 0 5px 0 #cccccc, 0 6px 0 #cccccc, 0 7px 0 #cccccc, 0 8px 0 #cccccc, 0 9px 0 #cccccc, 0 50px 30px rgba(0, 0, 0, 0.3);}
}

/* ----------------------------------------------
 * Generated by Animista on 2017-8-11 10:37:8
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation vibrate-1
 * ----------------------------------------
 */
@-webkit-keyframes vibrate-1 {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
  20% {
    -webkit-transform: translate(-2px, 2px);
            transform: translate(-2px, 2px);
  }
  40% {
    -webkit-transform: translate(-2px, -2px);
            transform: translate(-2px, -2px);
  }
  60% {
    -webkit-transform: translate(2px, 2px);
            transform: translate(2px, 2px);
  }
  80% {
    -webkit-transform: translate(2px, -2px);
            transform: translate(2px, -2px);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}
@keyframes duodong{
  0% {transform: translate(0);}
  20% {transform: translate(-2px, 2px);}
  40% { transform: translate(-2px, -2px);}
  60% {transform: translate(2px, 2px); }
  80% {transform: translate(2px, -2px); }
  100% {transform: translate(0);}
}


@-webkit-keyframes fudong {
  0% { transform: translateY(-600px) rotateX(-30deg) scale(0);
    transform-origin: 50% 100%;
    opacity: 0;}
  100% {
      transform: translateY(0) rotateX(0) scale(1);
      transform-origin: 50% 1400px;
      opacity: 1;}
}

//
.opus-head{
   @include wh(100%,60px);
    span{
        padding-left: 182px;
    a{
        @include size("微软雅黑",13px,#444f58);
        line-height: 59px;
        color: #444f58;
    }
   } 
}
.opus-head{
   @include wh(100%,60px);
   border-bottom: 1px solid #dfdfdf;
    span{
        padding-left: 182px;
    a{
        @include size("微软雅黑",13px,#444f58);
        line-height: 59px;
    }
       a:hover{
            color:deepskyblue;
        }
        a:focus{
            color: red;
        }
    a:nth-child(3){
        color: #99999a;
    }
 
   } 
}
input{
    border: 1px solid #e7e7e7;
    cursor:pointer;
    border-radius: 4px;
}
input[type="button"]{
    text-indent: 0px;
}
input:hover{
    border-color: red;
}
input:focus{
    border-color: deepskyblue;
}
input[type="button"]:hover{
    background: yellow;
}
input[type="button"]:focus{
    background: deepskyblue;
}
a:hover{
            color:deepskyblue;
        }
        a:focus{
            color: red;
        }
.opus-account{
    box-sizing: border-box;
    width: 100%;
    .opus-function{
        @include wh(403px,994px);
        border-right: 1px solid #dfdfdf;
        .opus-user{
            @include wh(191px,159px);
            padding-left: 214px;
            text-align: center;
            border-bottom: 1px solid #dfdfdf;
            position: relative;
            .opus-user1{
                @include wh(158x,101px);
                margin-top:20px;
                padding-bottom: 15px;
                cursor:pointer;
                img{
                    @include wh(100px,101px);
              }
              }
              h1{
                  font-size: 16px;
                  font-weight: normal;
              }
            .opus-user2{
                @include wh(16px,16px);
                display: block;
                position: absolute;
                bottom:27px;
                right:40px;
                img{
                    width: 100%;
                }
            }
        }
    }
       .opus-cword{
            @include wh(189px,809px);
            margin-left:214px;
            border-right: 1px solid #dfdfdf;
            .opus-cword-font{
                padding-top: 36px;
                 width: 159px;
                 text-align: left;
                 height: auto !important;
                 overflow: visible !important;
                 dl{
                     position: relative;
                     margin-left: 65px;
                     a:hover{
                         color:#eb413d;
                     }
                     .opus-red{
                     a{
                     color:#eb413d;
                     }
                 }
                     
                 dt{
                         font-size: 16px;
                         line-height:30px;
                         position: relative;
                         cursor: pointer;
                         color: #444f58;
                         a{
                             color: #444f58;
                         }
                     }
                
                 dd{
                     font-size: 13px;
                     line-height: 30px;
                     padding-left:5px;
                     a{
                        color: #878787;
                     }
                 }
                 dd:last-child{
                     padding-bottom: 6px;
                 }
                 }
            }
        }
 }
